<template>
	<div class="aid">
		<div class="base">
			<p class="fixed-top">
				{{ JSON.stringify(text) == '{}' ? '添加活动类型申请权限' : '修改活动类型申请权限' }}
				<a-icon @click="closeFunction" type="close" />
			</p>
			<div class="main" id="new_message">
				<a-form-model ref="ruleForm" :model="form" :rules="rules">
					<a-form-model-item label="活动分类">{{ $route.query.Name }}</a-form-model-item>
					<a-form-model-item label="类型" prop="Type">
						<a-select :allowClear="true" v-model="form.Type" placeholder="全部" @change="TypeChange">
							<a-select-option v-for="(item, index) in TypeList" :key="item.Key" :value="item.Key">{{ item.Value }}</a-select-option>
						</a-select>
					</a-form-model-item>
					<a-form-model-item label="学院/部门" prop="Value" v-if="form.Type == 1 || form.Type == 2">
						<a-select v-model="form.Value" mode="multiple" showSearch optionFilterProp="children" style="width:100%">
							<a-select-option v-for="(item, index) in DepartCodeList" :key="item.Code" :value="item.Code">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-model-item>
					<a-form-model-item label="学生组织" prop="Value" v-if="form.Type == 3">
						<a-select v-model="form.Value" mode="multiple" showSearch optionFilterProp="children" style="width:100%" @search="fetchClub">
							<a-select-option v-for="(item, index) in ClubList" :key="item.ID" :value="item.ID">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-model-item>
					<a-form-model-item label="级别" prop="ActivityLevelID">
						<a-select v-model="form.ActivityLevelID" style="width:100%">
							<a-select-option v-for="(item, index) in LevelList" :key="item.ID" :value="item.ID">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-model-item>
					<a-form-model-item label="学生组织类型" prop="ClubTypeID" v-if="form.Type == 1">
						<a-select :allowClear="true" v-model="form.ClubTypeID" placeholder="全部">
							<a-select-option v-for="(item, index) in ClubTypeList" :key="item.ID" :value="item.ID">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-model-item>
					<!-- <a-form-model-item label="参与者分值" prop="Score"><a-input type="number" v-model="form.Score" /></a-form-model-item>
					<a-form-model-item label="观众分值" prop="AudienceScore"><a-input type="number" v-model="form.AudienceScore" /></a-form-model-item>
					<a-form-model-item label="工作人员分值" prop="WorkerScore"><a-input type="number" v-model="form.WorkerScore" /></a-form-model-item> -->
					<a-form-model-item label="按小时计算" prop="IsHour"><a-switch checked-children="是" un-checked-children="否" v-model="form.IsHour" /></a-form-model-item>
					<a-form-model-item label="" class="fixed-bottom">
						<a-button type="primary" @click="handleSubmit">{{ JSON.stringify(text) == '{}' ? '确认添加' : '确认修改' }}</a-button>
						<a-button style="margin-left: 10px;" @click="closeFunction">取消</a-button>
					</a-form-model-item>
				</a-form-model>
			</div>
		</div>
	</div>
</template>

<script>
import { AddActivityTypeApply, UpdateActivityTypeApply,GetClubPageListCommon } from '@/api/follow';
export default {
	props: {
		text: Object,
		DepartCodeList: Array,
		LevelList: Array,
		ClubTypeList: Array,
	},
	watch: {
		text: function(text) {
			if (JSON.stringify(text) == '{}') {
			} else {
				this.form = text;
			}
		},
		form: {
			handler(newName, oldName) {
				if(newName.Type==2){
					this.rules.Value[0].required = false
				}else{
					this.rules.Value[0].required = true
				}
			},
			deep: true
		}
	},
	data() {
		return {
			TypeList: this.global.ActivityTypeList,
			formLayout: 'horizontal',
			form: this.$form.createForm(this, {
				name: 'coordinated'
			}),
			DepartmenDropdowntList: [],
			form: {
				Type: '',
				Value: [],
				ActivityLevelID: '',
				Score: '',
				AudienceScore: '',
				WorkerScore: '',
				IsHour: false,
				ClubTypeID: ''
			},
			rules: {
				Type: [
					{
						required: true,
						message: '请选择类型',
						trigger: 'change'
					}
				],
				Value: [
					{
						required: true,
						message: '请选择部门',
						trigger: 'change'
					}
				],
				ActivityLevelID: [
					{
						required: true,
						message: '请选择等级',
						trigger: 'change'
					}
				],
				Score: [
					{
						required: true,
						message: '请输入参与者分值',
						trigger: 'change'
					}
				],
				AudienceScore: [
					{
						required: true,
						message: '请输入观众分值',
						trigger: 'change'
					}
				],
				WorkerScore: [
					{
						required: true,
						message: '请输入工作人员分值',
						trigger: 'change'
					}
				]
				// IsHour: [
				// 	{
				// 		required: true,
				// 		message: '请选择是否按小时计算',
				// 		trigger: 'change'
				// 	}
				// ],
			}
		};
	},
	created() {
		this.fetchClub()
	},
	methods: {
		TypeChange(){
			this.form.Value = []
		},
		async fetchClub(value) {
			let data = {};
			data.key = value;
			let res = await GetClubPageListCommon(data);
			this.ClubList = res.data.data;
		},
		closeFunction(data) {
			this.form = {
				Type: '',
				Value: [],
				ActivityLevelID: '',
				Score: '',
				AudienceScore: '',
				WorkerScore: '',
				IsHour: false,
				ClubTypeID: ''
			}
			this.$emit('closeFun', data);
		},
		handleSubmit(e) {
			this.$refs.ruleForm.validate(async valid => {
				if (valid) {
					let that = this;
					let data = this.form;
					let res = {};
					data.ActivityTypeID = this.$route.query.activityTypeID;
					if (this.form.Value && this.form.Value.length > 0) {
						let list = this.form.Value;
						for (let i = 0; i < list.length; i++) {
							data.Value = list[i];
							res = JSON.stringify(this.text) == '{}' ? await AddActivityTypeApply(data) : await UpdateActivityTypeApply(data);
							that.$message[res.data.code == 0 ? 'success' : 'error'](res.data.msg);
						}
					} else {
						if(!data.Value){
							data.Value = 'Class'
						}
						res = JSON.stringify(this.text) == '{}' ? await AddActivityTypeApply(data) : await UpdateActivityTypeApply(data);
						that.$message[res.data.code == 0 ? 'success' : 'error'](res.data.msg);
					}

					this.closeFunction('1');

					// if (JSON.stringify(this.text) == '{}') {
					// 	res = await AddActivityTypeApply(data);
					// } else {
					// 	res = await UpdateActivityTypeApply(data);
					// }
					// if (res.data.code === 0) {
					// 	this.$message.success(res.data.msg);
					// 	this.closeFunction('1');
					// }else{
					// 	this.$message.error(res.data.msg);
					// }
				} else {
					return false;
				}
			});
		}
	}
};
</script>

<style lang="less" scoped>
/deep/.ant-form-item {
	margin: 20px 50px;
	display: flex;
}
/deep/.ant-form-item-label {
	width: 100px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-align: right;
}
/deep/.ant-form-item-control-wrapper {
	flex: 1;
}

.ant-form-item {
	margin-bottom: 10px;
}

/deep/.ant-form {
	margin-top: 50px;
	padding-bottom: 50px;
}
</style>
